import QtQuick 2.4
import QtQuick.Controls 1.3
import QtQuick.Controls.Styles 1.3

TextField
{
    id: textField1

    property string dateValue
    x: 0
    y: 0
    width: 175
    height: 30
    z: 1

    style: TextFieldStyle {
        textColor: "white"
        background: Rectangle {
            color: "#CC333333"
            radius: 2

            implicitWidth: 100
            implicitHeight: 30
            border.color: "#FFCCCCCC"
            border.width: 1
        }
    }

    Calendar{
        id: calendar
        width: 374
        height: 259
        z: 0
        anchors.topMargin: 0
        anchors.top: parent.bottom
        visible: false
        activeFocusOnTab: true
        maximumDate: new Date() //最大值默认为当前日期
        style: CalendarStyle {

            dayDelegate: Rectangle {
                gradient: Gradient {
                    GradientStop {
                        position: 0.00
                        color: styleData.selected ? "#111" : (styleData.visibleMonth && styleData.valid ? "#444" : "#666");
                    }
                    GradientStop {
                        position: 1.00
                        color: styleData.selected ? "#444" : (styleData.visibleMonth && styleData.valid ? "#111" : "#666");
                    }
                    GradientStop {
                        position: 1.00
                        color: styleData.selected ? "#777" : (styleData.visibleMonth && styleData.valid ? "#111" : "#666");
                    }
                }

                Label {
                    text: styleData.date.getDate()
                    anchors.centerIn: parent
                    color: styleData.valid ? "white" : "grey"
                }

                Rectangle {
                    width: parent.width
                    height: 1
                    color: "#555"
                    anchors.bottom: parent.bottom
                }

                Rectangle {
                    width: 1
                    height: parent.height
                    color: "#555"
                    anchors.right: parent.right
                }
            }
        }


        onReleased: {
            text = date;
            text = text.substr(0, 10);
            dateValue = text;
            visible = false;
        }
    }

    Button{
        id: downBtn
        width: 25
        height: 25
        antialiasing: false
        z: 0
        transformOrigin: Item.Center
        scale: 1
        anchors.right: parent.right
        anchors.rightMargin: 0
        anchors.bottom: parent.bottom
        anchors.bottomMargin: 0
        anchors.top: parent.top
        anchors.topMargin: 0
        iconSource: "./切图/查询定位/下拉触碰.png"
        style: ButtonStyle{
            background: Rectangle {
                implicitWidth: 20
                implicitHeight: 2
            }

        }
        onClicked: calendar.visible = !calendar.visible
    }

    onDateValueChanged: {
        text = dateValue;
        calendar.selectedDate = dateValue;
    }
}
